import {connect} from 'react-redux'
import {useEffect,useState} from 'react'
import {addUserData} from '../../../redux/actions/user.js'
import {addBlogData} from '../../../redux/actions/blog'
// import axios from 'axios'
import axios from '../../../assets/js/intercepotr'
import Background from '../../../components/Member/backGround'
import InnerContainer from '../../../components/Member/InnerContainer'
import './index.less'
const Member = function(props){
  const [userData,setUserData] = useState('')
  useEffect(()=>{
    getUser()
    getBlog()
  },[])// eslint-disable-line

  const getUser = async ()=>{
    let res = await axios.get('/api/client/user')
    if(res.code === 200){
      props.addUser(res.result)
      setUserData(res.result)
      
    }
  }

  const getBlog = async ()=>{
    let res = await axios.post('/api/client/blog')
    if(res.code === 200){
      props.addBlog(res.result.blog)
    }
  }

  return (
    <div className="member-container">
      <Background userData={userData.user&&userData.user[0]}/>
      <InnerContainer userData={userData.user&&userData.user[0]}/>
    </div>
  )
}

export default connect(state=>({
  userData:state.user,
  blog:state.blog
})
,{
  addUser:addUserData,
  addBlog:addBlogData
})(Member)